<template>
  <div>
      <el-form ref="form" :model="data" label-width="100px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="进货日期">
              {{ data.purchasetime }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="供应商名称">
              {{ data.scunitname }}
            </el-form-item>
          </el-col>
        </el-row>
         <el-row>
          <el-col :span="12">
            <el-form-item label="品种名称">
              {{ data.salessubitemname }}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="品种数量">
              {{ data.purchaseweight + data.company}}
            </el-form-item>
          </el-col>
        </el-row>
        <!-- <el-row> -->
        <!-- <el-col :span="12">
            <el-form-item label="快检记录">
                {{data.purchasetime}}
            </el-form-item>
          </el-col>
           <el-col :span="12">
            <el-form-item label="合格证明文件">
                  {{data.scunitname}}
            </el-form-item>
          </el-col>
        </el-row>

             <el-row>
          <el-col :span="12">
            <el-form-item label="采购凭证">
                {{data.purchasetime}}
            </el-form-item>
          </el-col>
        </el-row> -->
      </el-form>

      <el-table :data="[data]" border style="width: 100%" v-if="false">
        <el-table-column
          prop="salessubitemname"
          label="品种名称"
        ></el-table-column>
        <el-table-column label="品种数量">
          <template slot-scope="scope">
            {{ scope.row.purchaseweight + scope.row.company }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="scunitname" label="产地/生产厂商">
          <template slot-scope="scope">
            <div>{{ scope.row.manufacturerStr || "--" }}</div>
          </template>
        </el-table-column> -->
      </el-table>
        <h3 v-if="data.imgList.filter(x=>x.category=='NSPG').length">核磅查验</h3>
        <el-image
           v-for="(item,index) in data.imgList.filter(x=>x.category=='NSPG')"
            style="width:100px; height:100px"
            :src="item.fileaddress"
            :preview-src-list="data.imgList.filter(x=>x.category=='NSPG').map(x=>x.fileaddress)"
            :key="index" 
          >
          </el-image>
      <!-- <el-tabs v-model="activeName">
        <el-tab-pane label="快检记录" name="1"> -->
          <h3>快检记录</h3>
          <el-table :data="list" border style="width: 100%">
            <el-table-column
              prop="quickCheckDate"
              label="检测日期"
              width="160"
            ></el-table-column>
            <el-table-column label="检测结果" width="120">
              <template slot-scope="scope">
                <div>
                  <div class="red" v-if="scope.row.quickCheckResult == '+'">
                    疑似阳性
                  </div>
                  <div class="green" v-else>阴性</div>
                </div>
              </template>
            </el-table-column>
            <el-table-column
            width="130"
              prop="salesSubitemName"
              label="检测品种"
            ></el-table-column>
            <el-table-column
              prop="quickCheckSubitemName"
              label="检测项目"
            ></el-table-column>
            <el-table-column
              prop="quickCheckUnitName"
              label="快检单位"
            ></el-table-column>
          </el-table>
            <h3>合格证明文件</h3>
        <!-- </el-tab-pane>
        <el-tab-pane label="合格证明文件" name="2"> -->
          <!-- <div class="right">
            <a href="javascript:;">食品证明文件说明</a>
            <span class="iconfont icon-wenhao"></span>
          </div> -->
          <upload v-model="imageList" :disabled="true" v-if="show" />
          <div class="item">
            <div
              class="item_icon"
              v-for="(items, index) in fileList"
              :key="index"
              @click="$downloadFiles(items.url)"
            >
              <!-- <span
                class="el-icon-document-add"
                @click="$downloadFiles(items.url)"
              >
              </span> -->
                <el-image
            style="width:50px; height:50px;margin-right:10px;cursor: pointer;"
           src="https://spaq.suzhou.gov.cn/image/ssa_Desktop/ssa_20230217pdf.png"
          >
          </el-image>
            </div>
          </div>
          <el-empty
            description="暂无数据"
            v-if="imageList.length == 0 && fileList.length == 0"
          ></el-empty>
        <!-- </el-tab-pane> -->
        <!-- <el-tab-pane label="采购凭证" name="3"> -->
             <h3>采购凭证</h3>
          <upload v-model="purchase" :disabled="true"   v-if="show"/>
          <el-empty
            description="暂无数据"
            v-if="purchase.length == 0"
          ></el-empty>
        <!-- </el-tab-pane>
      </el-tabs> -->
  </div>
</template>
<script>
import {
  findTestReportAndPurchasingDocuments,
  jcFindListByCondition,
} from "@/api/modules/enterprise";

export default {
   props:{
    data:{
      type:Object,
    }
  },
  // props:[],
  // 页面加载
  created() {
    
    // if (this.$route.query.data) {
    //   let data = JSON.parse(this.$route.query.data);
    //   this.data = data;
      this.findTestReportAndPurchasingDocuments({
        detailsId: this.data.id,
        purchasecode: this.data.purchasecode,
      });
      this.jcFindListByCondition();
    // }
  },
  // 页面加载完成
  mounted() {},
  //实例销毁之前
  beforeDestroy() {},
  //实例销毁后
  destroyed() {},
  data() {
    return {
      // data: {},
      // activeName: "1",
      imageList: [],
      fileList: [],
      purchase: [],
      list: [],
      show:false,
    };
  },
  // 方法
  methods: {
    async findTestReportAndPurchasingDocuments(purchasecode) {
      let { data } = await findTestReportAndPurchasingDocuments(purchasecode);
      data.testReportResponseList.forEach((item) => {
                   item.fileaddress= item.fileaddress.replace("PDF","pdf")
        if (item.fileaddress.match(/[^\.]\w*$/)[0] == "pdf") {
          this.fileList.push({ url: item.fileaddress });
        } else {
          this.imageList.push({ url: item.fileaddress });
        }
      });
      data.purchasingDocumentsResponseList.forEach((x) => {
        x.url = x.fileaddress;
      });
      this.purchase = data.purchasingDocumentsResponseList;
      this.show=true
    },
    async jcFindListByCondition() {
      let { data } = await jcFindListByCondition({
        pageIndex: 0,
        pageSize: 0,
        purchasecode: this.data.purchasecode,
        purchasetime: this.data.purchasetime,
        sclicenseno: this.data.sclicenseno,
        salessubitemname: this.data.salessubitemname,
        unitId: this.data.unitId,
      });
      this.list = data.list;
    },
  },
  // 监听属性
  watch: {},
  // 组件
  components: {
    upload: () => import("@/views/enterprise/components/upload"),

  },
  // 计算属性
  computed: {},
};
</script>

<style lang="scss" scoped>
.right {
  color: orange;
}

.item {
  display: flex;
  .item_icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 150px;
    border: 1px solid #c0ccda;
    border-radius: 6px;
    margin-right: 10px;
    cursor: pointer;
    .el-icon-document-add {
      font-size: 50px;
    }
  }
}
</style>